import ElMenu from './el-menu.vue'
import ElMenuItem from './el-menu'
import ElSubmenu from './el-sub-menu.vue'
// import Resub from './resub.vue'
export default {
  props: {
    data: {}
  }, 
  mounted () {
    console.log(this.data);
  },
  components: {
    ElMenu,
    // Resub,
    ElMenuItem,
    ElSubmenu
  },
  render() {
    let renderChildren = (data) => {
      const aa = data.map((child) => {
        if (!child.children || child.children.length === 0) {
          return <ElMenuItem>
            <li>{ child.title }</li>
          </ElMenuItem>;
        }
        if (child.children && child.children.length) {
          return <ElSubmenu>
            <div v-slot={"title"}>{child.title}</div>
            { renderChildren(child.children) }
          </ElSubmenu>;
        }
      })
      return aa;
    }
    return <el-menu>
      {renderChildren(this.data)}
    </el-menu>

  }
}